<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>运动数据</title>
</head>

<body>
    <main>
        <div class="relevant-data">
            <div id="backprev">
                <span class="iconfont iconleftarrow"></span>
            </div>
            <div class="data-title">
                <h4>我的运动数据</h4>
                <img src="../img/dog.jpg" alt="">
            </div>
            <ul class="week-data">
                <li>
                    <h6>总运动</h6>
                    <p><span id="sumTimes">0000</span>分钟</p>
                </li>
                <li>
                    <h6>本周消耗</h6>
                    <p><span>0000</span>千卡</p>
                </li>
            </ul>
            <ul class="total-data">
                <li>
                    <h6>消耗(千卡)</h6>
                    <p>0000</p>
                </li>
                <li>
                    <h6>累计(天)</h6>
                    <p id="sumDays">000</p>
                </li>
                <li>
                    <h6>连续(天)</h6>
                    <p id="continueDays">0000</p>
                </li>
            </ul>
        </div>
        <!-- echarts图 -->

        <div class="allChart">

            <!-- 柱状图 -->
            <div class="dataContent" id="histogram"></div>
            <!-- 饼状图 -->
            <div class="dataContent" id="pieChart"></div>
            <!-- 条形图 -->
            <div class="dataContent" id="barChart"></div>
            <!-- 折线图 -->
            <div class="dataContent" id="lineChart"></div>

        </div>



    </main>
    <!-- 引入echarts -->
    <script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.1.2/echarts.min.js"></script>
</body>

</html>

<!-- 
    echarts:
        1.引入在线echarts.js/下载echarts.js
        2.准备一个具有大小的容器
        3.初始化echarts对象
            let myChart=echarts.init(dom节点)
        4.写图表的配置(实例中心) cv
            option={}
        5.画图
            myChart.setOption(option)


 -->